<template>
	<view class="container">
		<view class="banner">
			<swiper class="carousel" :indicator-dots="true" :autoplay="true" :interval="5000" :duration="1000">
				<swiper-item @click="wxfy">
					<view class="swiper-item">
						<image src="../../static/index/banner_02.png"></image>
					</view>
				</swiper-item>
				<swiper-item @click="wxfy">
					<view class="swiper-item">
						<image src="../../static/index/banner_03.png"></image>
					</view>
				</swiper-item>
			</swiper>
			
		</view>
		<view class="goods">
			<view class="l">优选产品</view>
			<!-- <view class="r">
				<view class="location_icon"><image src="../../static/index/location.png" mode=""></image></view>
				<view class="address">厦门</view>
			</view> -->
		</view>
		<view class="item" 
		 v-for="(item, index) in list" 
		 :key="index" 
		 :data-query02="item.query02" 
		 :data-query01="item.query01">
			<view class="left">
				<view class="name">{{item.query02}}</view>
				<view class="most">线上审批</view>
				<!-- <view class="most_money">{{ item.query10 }}</view>
				<view class="rate">
					<text>年利率</text>{{ item.query13 }}<text>起</text>
				</view> -->
			</view>
			<view class="right">
				<!-- <view class="pic"><image src="../../static/index/pic.png" mode=""></image></view> -->
				<view class="pic1"  :data-query02="item.query02" :data-query01="item.query01" @click="apply">
					<!-- <image src="../../static/index/btn.png" mode=""></image> -->
					立即申请 >
				</view>
				<!-- <view class="deadline">
					<text>还款期限</text>
					<view class="deadline_detail">{{ item.query11 }}</view>
					<text>月</text>
				</view> -->
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			
			code:'',
			list: ''
		};
	},

	onLoad(e) {
		this.getProduct();
		// uni.clearStorageSync();
		this.code = this.getQueryString("code");
		// this.code = '001Rm1De26tdTF0KlUBe2jJnDe2Rm1Dc'
		console.log('code==='+this.code);
		if(!this.code ){
			this.getCode();
		}else{
			this.getOpenId();
		}
	},
	onShow() {
		
	},
	methods: {
		apply: function(e) {
			console.log(e);
			uni.navigateTo({
				url: '../order/order?query02='+e.currentTarget.dataset.query02
			})
		},
		getQueryString(name){
		    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");  
		    var r = window.location.search.substr(1).match(reg);  
		    if (r != null) return unescape(r[2]); return null;              
		},
		// 获取微信公众号code
		getCode() {
			var appId = 'wx2de15362c911f78e';
			// var redirectUri = 'https%3a%2f%2fwww.aibaokj.com%2fh6%2f';
			var redirectUri = 'https%3a%2f%2fwww.aibaokj.com%2f';
			window.location = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid='+appId+'&redirect_uri='+redirectUri+'&response_type=code&scope=snsapi_userinfo&state=123&connect_redirect=1#wechat_redirect';
		},
		// 获取openid
		getOpenId(){
			uni.request({
				url:this.$url + 'tenPayController/authv5?CODE='+this.code+'&appCode=zshxjt',
				method: 'GET',
				// data:{
				// 	'CODE': this.code,
				// 	'appCode': 'zshxjt'
				// },
				success: (res) => {
					console.log(res);
					if(res.statusCode == '200'){
						if(res.data.success){
							uni.setStorageSync("zs_openid", res.data.result.openid);
							uni.setStorageSync("zs_user_info", JSON.stringify(res.data.result));
						}else{
							uni.showToast({
								title:'请求失败',
								icon:'none',
								duration:2000
							})
						}
					}else{
						uni.showToast({
							title:'请求失败',
							icon:'none',
							duration:2000
						})
					}
				}
			})
		},
		getProduct: function(e) {
			console.log(this.$url);
			uni.request({
				url: this.$url + 'base/fxjBase_10/list',
				method: 'GET',
				success: res => {
					console.log(res);
					this.list = res.data.result.records;
					console.log(this.list);
				}
			});
		}
	}
};
</script>

<style>
	.carousel {
		width: 100%;
		height: 400rpx;
		border-radius: 15rpx;
	}
	
	.swiper-item {
		width: 100%;
		height: 400rpx;
		overflow: hidden;
	}
	
	.swiper-item>image {
		width: 690rpx;
		height: 260rpx;
	}
	
	.uni-swiper-dot-active {
		background-color: #FFFFFF;
	}
.banner {
	width: 750rpx;
	height: 400rpx;
	overflow: hidden;
}

.banner image {
	width: 750rpx;
	height: 400rpx;
}

.goods {
	margin: 30rpx 30rpx 10rpx 30rpx;
	width: 690rpx;
	display: flex;
}

.goods .l {
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(51, 51, 51, 1);
}

.goods .r {
	display: flex;
	position: absolute;
	right: 0;
	margin-right: 30rpx;
}

.goods .r .location_icon {
	width: 22rpx;
	height: 28rpx;
	line-height: 40rpx;
	margin-right: 10px;
}

.goods .r .location_icon image {
	width: 22rpx;
	height: 28rpx;
}

.goods .r .address {
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(51, 51, 51, 1);
}
.container .item {
	margin: 20rpx 30rpx 10rpx 30rpx;
	width: 690rpx;
	height: 150rpx;
	/* background: rgba(255, 255, 255, 1); */
	background-image: url(http://www.zhaodui.com.cn/pic/zhongshi/bg_01.png);
	background-size: 100% 100%;
	box-shadow: 0px 0px 18px 2px rgba(4, 0, 0, 0.1);
	border-radius: 10rpx;
	display: flex;
}
.container .item:nth-child(2n){
	background-image: url(http://www.zhaodui.com.cn/pic/zhongshi/bg_02.png);
	
}

.item .left {
	flex: 1;
	margin-left: 30rpx;
	margin-top: 30rpx;
}

.item .left .name {
	font-size: 40rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #FFFFFF;
	margin-bottom: 10rpx;
}

.item .left .most {
	font-size: 24rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #FFFFFF;
}

.item .left .most_money {
	font-size: 52rpx;
	font-family: PingFang SC;
	font-weight: bold;
	color: rgba(72, 118, 228, 1);
	margin-bottom: 16rpx;
}

.item .left .rate {
	font-size: 28rpx;
	font-family: PingFang SC;
	font-weight: 500;
	display: flex;
	color: #4876e4;
}

.item .left .rate text {
	color: #666666;
}

.item .right {
	margin-right: 30rpx;
}

.item .right .pic {
	width: 116rpx;
	height: 116rpx;
	position: absolute;
	margin-right: 30rpx;
	right: 0;
}

.item .right .pic image {
	width: 116rpx;
	height: 116rpx;
	position: absolute;
	right: 0;
}

.item .right .pic1 {
	/* position: absolute;
	right: 0;
	margin-right: 60rpx;
	width: 200rpx;
	height: 70rpx;
	margin-top: 120rpx; */
	font-size: 26rpx;
	color: #FFFFFF;
	line-height: 160rpx;
}

.item .right .pic1 image {
	width: 200rpx;
	height: 70rpx;
}

.item .right .deadline {
	display: flex;
	margin-top: 32rpx;
	font-size: 28rpx;
	font-family: PingFang SC;
	font-weight: 500;
	margin-top: 220rpx;
	position: absolute;
	right: 0;
	margin-right: 60rpx;
}

.item .right .deadline text {
	color: #666666;
}

.item .right .deadline .deadline_detail {
	color: #4876e4;
}
</style>
